<!DOCTYPE html>
<html lang="">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="css/css.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/newcss.css">
    <link rel="stylesheet" href="css/newstyle.css">
    <!-- <script src="http://apps.bdimg.com/libs/jquery/1.10.1/jquery.min.js"></script> -->
    <script type="text/javascript">
        !window.jQuery && document.write('<script src="js/jquery.min.js"><\/script>');
    </script>
    <script src="js/vue.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="js/public.js"></script>
    <title>订单详情</title>
</head>

<body style="background-color:#F3F2F0">
<div class="wrapper">
<!-- <div class="header">
    <ul>
        <li class="header_title_wrapper">订单详情</li>
        <li class="clear"></li>
    </ul> 
</div> -->
<div class="main mg_t0 orderlistvue">
    <div class="card cardflow rows mainorder">
        <div class="cols6 tit">已支付</div>
        <div class="cols6 txt">￥ {{info.sum}}</div>
    </div>
    <div class="session orderlist">
        <ul>
            <li class="elm">
               <a href="" class="rows">
                    <p class="cols3 tit">订单号</p>
                    <p class="cols9 txt font_right">{{info.order_no}}</p>
               </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols3 tit">接诊时间</p>
                    <p class="cols9 txt font_right">{{info.booking_time}}</p>
                </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols3 tit">接诊医师</p>
                    <p class="cols9 txt font_right">{{info.doctor_name}}</p>
                </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols3 tit">收款时间</p>
                    <p class="cols9 txt font_right">{{info.order_time}}</p>
                </a> 
            </li>
        </ul>
    </div>
    <div class="session orderlist">
        <ul>
            <li class="elm rows">
                <div class="cols9 tit user_head">
                    <img :src="info.user_img" alt="">
                    <span class="info_tips bg_blue">{{info.grade_name}}</span>
                </div>
                <div class="cols3 txt font_right">
                    <p class="name">{{info.user_name}}</p>
                    <p class="phone">{{info.user_phone}} </p>
                </div>
            </li>
        </ul>
    </div>
    <div class="session orderlist">
        <!-- <ul>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols9 tit">诊疗项目：【基础】推拿</p>
                    <p class="cols3 txt font_right">￥ 99.00</p>
                </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols9 tit">使用药品：【药品】药品</p>
                    <p class="cols3 txt font_right">￥ 99.00</p>
                </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols9 tit">合计</p>
                    <p class="cols3 txt font_right">￥ 99.00</p>
                </a> 
            </li>
        </ul> -->
        <ul>
            <li class="elm" v-for="(inf,index) in info.goods" :key="'goods'+index">
                <a href="" class="rows">
                    <p class="cols9 tit">使用药品：{{inf.goods_name}}</p>
                    <p class="cols3 txt font_right">￥ {{inf.goods_sum_cost}}</p>
                </a> 
            </li>
            <li class="elm" v-for="(inf,index) in info.service" :key="'service'+index">
                <a href="" class="rows">
                    <p class="cols9 tit">诊疗项目：{{inf.service_name}}</p>
                    <p class="cols3 txt font_right">￥ {{inf.service_sum_cost}}</p>
                </a> 
            </li>
            <li class="elm">
                <a href="" class="rows">
                    <p class="cols9 tit">合计</p>
                    <p class="cols3 txt font_right">{{info.sum}}</p>
                </a> 
            </li>
        </ul>
    </div>
</div> 
<div class="mark"></div>
<div class="pop">
    <div class="popcnt"><p>文本?</p></div>
    <div class="popbtngroup rows nopd">
        <div class="cols6 popbtn cancel"><a href="javascript:void(0)" class="popcancel">取消</a></div>
        <div class="cols6 popbtn last ok"><a href="javascript:void(0)" class="popgo">确定</a></div>
    </div>
</div> 
</div>
</div>
<script src="./js/temp.js" type="text/javascript"></script>  
</body>
</html>